<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<title>关于我们</title>
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="../fonts/iconfont/iconfont.css" />
		<link rel="stylesheet" type="text/css" href="../cropper/cropper.min.css" />
		<link rel="stylesheet" type="text/css" href="../css/global.css" />
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<a class="mui-icon iconfont mui-pull-right" style="color:#000; font-size:20px;" onclick="confirm();">&#xe6aa;</a>
		</header>
		<div class="mui-content">
			<a href="#picture" onclick="galleryImgs()" style="position: absolute;top: 300px;height: 40px;background: #000;">
				<div id="changeAvatar" style="border: 1px solid red;width: 200px;height: ;">dsadajksldbnjksa</div>
			</a>

			<div id="showEdit" style="border: 1px solid #000;">
				<div id="report"></div>
			</div>
			
			
			<button type="button" class="mui-btn mui-btn-blue mui-btn-block" style="position: absolute;bottom: 0;left: calc(50% - 60px);padding: 6px;width: 120px;" onclick="postAvatar()">上传</button>
		</div>
	</body>
	<script src="../js/mui.min.js"></script>
	<script src="../js/open.js"></script>
	<script src="../js/jquery.min.js"></script>
	<script src="../cropper/cropper.min.js"></script>
	<script>
		//拍照
		function getImage() {
			var cmr = plus.camera.getCamera();
			cmr.captureImage(function(p) {
				plus.io.resolveLocalFileSystemURL(p, function(entry) {
					var localurl = entry.toLocalURL(); //
					$("#report").html('<img src="' + localurl + '">');
					cutImg();
					mui('#picture').popover('toggle');
				});
			});
		}
		//相册选取
		function galleryImgs() {
			plus.gallery.pick(function(e) {
				$("#report").html('<img src="' + e.files[0] + '">');
				cutImg();
				mui('#picture').popover('toggle');
			}, function(e) {
				//outSet( "取消选择图片" );
			}, { filter: "image", multiple: true });
		}

		function cutImg() {
			$("#showEdit").fadeIn();
			var image = $('#report > img');
			image.cropper({
				aspectRatio: 1 / 1,
				autoCropArea: 0.8
			});
		}

		function confirm() {

			$("#showEdit").fadeOut();
			var image = $('#report > img');
			var dataURL = image.cropper("getDataURL");
			$("#changeAvatar").html('<img src="' + dataURL + '" />');
		}

		function postAvatar() {

			var image = $('#report > img');
			var dataURL = image.cropper("getDataURL");
			alert(dataURL);
			var data = {
				base64: dataURL
			};
			$.post(url, data, function(data) {
				//这里就自己写了哈
			});
		};
	</script>

</html>